﻿
body
{
    background-color:Navy;
}

#outer_wrapper 
{
    width:960px;
    background:#fff url(left.gif) repeat-y left;
    margin:0 auto;
    border: 1px solid red;
    border-bottom-left-radius: 30px 30px;
    border-bottom-right-radius: 30px 30px; 
    border-top-left-radius: 30px 30px;
    border-top-right-radius: 30px 30px;
}

#wrapper 
{
}

#header 
{
    border:1px solid #b0b0b0;
    background:#b0b0b0;
    background-image:url(../Images/Banner.png);
    width:938px;
    height:200px;
    margin:0;
    padding: 0 10px 0 10px;
    border-top-left-radius: 30px 30px;
    border-top-right-radius: 30px 30px;
}

#container 
{
    float:left;
    width:100%;
    display:inline;
    margin-left:-200px;
    
}

#left 
{
    float:left;
    width:180px;
    display:inline;
    margin-left:200px;
    border: 1px solid;
}

#main 
{
    /* the width from #left (150px) + the negative margin from #container (200px) */
    margin-left:381px;
    border: 1px solid;
    height: 600px; 
}

#sidebar 
{
    padding-left:100%;
    margin-left:-200px;
    
}

#sidebar p 
{
    position:relative;
}

#footer 
{
    /* see #outer_wrapper  */
    width:940px;
    /* this is to clear #container */
    clear:both;
    background:#b0b0b0;
    margin: 0px; 
    padding: 0 10px 0 10px;
    border-bottom-left-radius: 30px 30px;
    border-bottom-right-radius: 30px 30px;
    text-align: center 
}
/* this is the class that is applied to 2 structural hacks in the markup. The first "meaningless" element is used to clear #left in NN6 and the last one is used to clear #container in NN4 */
.clearing 
{   
    height:0;
    clear:both;
}

/* Div for each module and include */
#login-area
{
    font-family: impact,sans-serif;
    border-color: white;
    border-width: thin;
    border-style: solid;
    padding: 5px;
}